<template>
  <div>
    <span class="header">添加英雄</span>
    <br>
    
    <span>英雄名称：</span>
    <input type="text" v-model="name" >
    <br>
    <br>
    <span>性  别：</span>
    <!-- 只要input中v-model绑定同一个属性 (例如:gender) 就会实现单选  -->
    <input type="radio" value="男" v-model="gender"> 男
    <input type="radio" value="女" v-model="gender"> 女
    <br>
    <br>
    <button type="button" class="btn btn-success" @click="addHero">确定添加</button>
  </div>
</template>

<script>
export default {
  data(){
    return {
      gender:'',
      name:''
    }
  },
  methods:{
    addHero(){
      this.$http.post('http://localhost:6005/heroList',{
        gender: this.gender,
        name: this.name,
        time: new Date()
      }).then((res) => {
        console.log('添加英雄成功')
        this.$router.push({
          path:'/herolist'
        })
      })
    }
  }

}
</script>

<style>

</style>